<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>哈尔滨信息工程学院</title>
    <meta name="description" content="哈尔滨信息工程学院" /><!-- 网站描述 -->
    <meta name="keywords" content="哈信息,计算机学院" /><!-- 网站关键词,每个词之间用逗号隔开 -->

    <link rel="stylesheet" href="main.css">
</head>

<body>
    <header>
        <div class="flex hjz">
            <div><img src="./素材/logo.png" alt="" class="logo"></div>
            <div>
                <input type="text" value="请输入想要搜索的内容">
                <button>搜索</button>
            </div>
        </div>
    </header>
    <nav>

        <div>
            <a href="">首页 </a>
            <a href="">学校概况</a>
            <a href="">组织结构</a>
            <a href="">教师队伍</a>
            <a href="">学科专业</a>
            <a href="">教学研究</a>
            <a href="">招生就业</a>
            <a href="">学生成长</a>
            <a href="">校园生活</a>
            <a href="">公共服务</a>
        </div>
    </nav>
    <!-- 以上头部 -->
    <!-- 以下内容 -->
    <main>
        <div class="bn">

            <ul id="ul1">
                <!-- <li><img src="./素材/l5.jpg" alt=""></li> -->
                <li><img src="./素材/l1.jpg" alt=""></li>
                <li><img src="./素材/l2.jpg" alt=""></li>
                <li><img src="./素材/l3.jpg" alt=""></li>
                <li><img src="./素材/l4.jpg" alt=""></li>
                <li><img src="./素材/l5.jpg" alt=""></li>
                <li><img src="./素材/l1.jpg" alt=""></li>
            </ul>
            <div class="left">&lt;</div>
            <div class="right">&gt;</div>
            <ul id="ul2">
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>
        <div class="flex">
            <div class="box_div2">
                <dl>
                    <dt>校友聚焦<span class="lt"> </span></dt>
                    <dd><img src="./素材/4.jpg" alt=""></dd>
                </dl>
                <dl>
                    <dt>校友名录<span class="lt"> </span><span class="gengduo">更多</span></dt>
                    <dd><a href=""> -省纪委驻教育厅纪检监察组组长崔志春......</a><span class="biao"></span><span
                            class="tshij">2020年3月3日</span></dd>
                    <dd><a href=""> -省纪委驻教育厅纪检监察组组长崔志春......</a><span class="biao"></span><span
                            class="tshij">2020年3月3日</span></dd>
                    <dd><a href=""> -省纪委驻教育厅纪检监察组组长崔志春......</a><span class="biao"></span><span
                            class="tshij">2020年3月3日</span></dd>
                    <dd><a href=""> -省纪委驻教育厅纪检监察组组长崔志春......</a><span class="biao"></span><span
                            class="tshij">2020年3月3日</span></dd>
                    <dd><a href=""> -省纪委驻教育厅纪检监察组组长崔志春......</a><span class="biao"></span><span
                            class="tshij">2020年3月3日</span></dd>
                    <dd><a href=""> -省纪委驻教育厅纪检监察组组长崔志春......</a><span class="biao"></span><span
                            class="tshij">2020年3月3日</span></dd>
                    <dd><a href=""> -省纪委驻教育厅纪检监察组组长崔志春......</a><span class="biao"></span><span
                            class="tshij">2020年3月3日</span></dd>
                    <dd><a href=""> -省纪委驻教育厅纪检监察组组长崔志春......</a><span class="biao"></span><span
                            class="tshij">2020年3月3日</span></dd>
                </dl>
            </div>

            <div class="youce">
                <dl class="xiaoyou">
                    <dt>校友活动<span class="lt"> </span><span class="gengduo2">更多</span></dt>
                    <dd> <span class="youjiantou"></span><a href=""> 省纪委驻教育厅纪检监察组组长崔志春...</a><span
                            class="riqi">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href=""> 省纪委驻教育厅纪检监察组组长崔志春...</a><span
                            class="riqi">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href=""> 省纪委驻教育厅纪检监察组组长崔志春...</a><span
                            class="riqi">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href=""> 省纪委驻教育厅纪检监察组组长崔志春...</a><span
                            class="riqi">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href=""> 省纪委驻教育厅纪检监察组组长崔志春...</a><span
                            class="riqi">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href=""> 省纪委驻教育厅纪检监察组组长崔志春...</a><span
                            class="riqi">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href=""> 省纪委驻教育厅纪检监察组组长崔志春...</a><span
                            class="riqi">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href=""> 省纪委驻教育厅纪检监察组组长崔志春...</a><span
                            class="riqi">2020年3月3日</span></dd>

                </dl>

                <dl class="shidian">
                    <dt>校友视点<span class="lt"> </span><span class="gengduo2">更多</span></dt>
                    <dd> <span class="youjiantou"></span><a href="">哈尔滨信息工程学院师生党员积极捐款支持新冠肺炎疫情防控工作</a> <span
                            class="riqi2">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href="">哈尔滨信息工程学院师生党员积极捐款支持新冠肺炎疫情防控工作</a> <span
                            class="riqi2">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href="">哈尔滨信息工程学院师生党员积极捐款支持新冠肺炎疫情防控工作</a> <span
                            class="riqi2">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href="">哈尔滨信息工程学院师生党员积极捐款支持新冠肺炎疫情防控工作</a> <span
                            class="riqi2">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href="">哈尔滨信息工程学院师生党员积极捐款支持新冠肺炎疫情防控工作</a> <span
                            class="riqi2">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href="">哈尔滨信息工程学院师生党员积极捐款支持新冠肺炎疫情防控工作</a> <span
                            class="riqi2">2020年3月3日</span></dd>
                    <dd> <span class="youjiantou"></span><a href="">哈尔滨信息工程学院师生党员积极捐款支持新冠肺炎疫情防控工作</a> <span
                            class="riqi2">2020年3月3日</span></dd>

                </dl>


                <dl class="fengcai">
                    <dt>校园风采<span class="lt"> </span> <span class="gengduo2">更多</span></dt>
                    <dd>
                        <div>
                            <img src="./素材/img2.jpg" alt="">
                            <img src="./素材/img2.jpg" alt="">
                            <img src="./素材/img2.jpg" alt="">
                            <img src="./素材/img2.jpg" alt="">
                        </div>
                    </dd>
                </dl>
            </div>
        </div>

    </main>
    <!-- 以上内容结束 -->
    <!-- 尾部开始 -->
    <footer>
        <div class="foter flex">
            <div class="flex">
                <div class="logobuttom"></div>
                <ul>
                    <li>哈东校区：哈尔滨宾西技术开发区大学城9号</li>
                    <li>江北校区：哈尔滨市利民开发区大学城9号</li>
                    <li>版权：哈尔滨信息工程学院</li>
                    <li>备案号：黑ICP备05007064号</li>
                </ul>
            </div>
            <div class="flex">
                <div class="selectmg">
                    <div>
                        <select name="" id="">
                            <option value=""></option>
                            <option value=""></option>
                        </select>
                    </div>
                    <div>
                        <select name="" id="">
                            <option value=""></option>
                            <option value=""></option>
                        </select>
                    </div>
                </div>


                <div class="wechatmg">
                    <dl>
                        <dd><img src="./素材/wechat.jpg" alt=""></dd>
                        <dd>哈尔滨信息工程学院</dd>
                        <dd>微信公众平台</dd>
                    </dl>
                </div>
            </div>


        </div>

    </footer>
    <!-- 结束尾部 -->



</body>
<script>
    var ul1 = document.getElementsByClassName('bn')[0];
    var di = document.getElementById('ul2').children;
    var left = document.getElementsByClassName('left')[0];
    var right = document.getElementsByClassName('right')[0];
    var ul1 = document.getElementById('ul1');
    var index = 0;
    function dingshiqi() {
        ding = setInterval(function () {
            index += -1000;
            ul1.style.left = index + 'px';
            if(index==-6000){
                index=0;
                index *= -1000;
                ul1.style.transitionDuration=0+'s';
                ul1.style.left = index + 'px';
            }else{
                ul1.style.transitionDuration=2+'s';
            }
        }, 6000);
    }
    dingshiqi();
    for (let i = 0; i < di.length; i++) {
        di[i].onclick = function () {
            changeDi(i);
        }
    }
    function changeDi(i) {
        clearInterval(ding);
        i *= -1000;
        console.log(i)
        ul1.style.left = i + 'px';
        if (index !== i) {
            index = i;
        }
        dingshiqi();
    }


</script>

</html>